<template>
	<view class="weixinlogin_content">
		<u-navbar :autoBack="true" title="微信登录"></u-navbar>
		<view class="logo-view">
			<image class="logo" :src="configInfo.logo" mode="widthFix"></image>
		</view>
		<view class="" style="width: 80%;margin:auto;">
			<u-button type="primary" open-type="getPhoneNumber" @getphonenumber="getPhone" color="#43ad47" shape="circle" text="授权登录" ></u-button>
		</view>
	</view>
</template>

<script>
	import {weixinLogin} from '@/common/http/api.js'
	import {configInfo} from '@/common/utils.js'
	import {
		mapState,
		mapMutations
	} from 'vuex';
	export default {
		data() {
			return {
				configInfo,
				weixinInfo:{
					encryptedData:'',
					code:'',
					iv:''
				}
			}
		},
		methods: {
			...mapMutations(['login']),
			getPhone(e){
				this.weixinInfo.iv = e.detail.iv;
				this.weixinInfo.encryptedData = e.detail.encryptedData
				// let obj = {
				// 	iv: e.detail.iv,
				// 	encryptedData: e.detail.encryptedData,
				// 	code: this.weixinInfo.code
				// }
				weixinLogin(this.weixinInfo).then(result1 =>{
					this.login(result1.data)
					this.$ut.msg("登录成功!");
					setTimeout(() => {
						uni.$u.route({
							url: 'pages/index/index',
							type:'redirectTo'
						})
					}, 1200)
				})
			},
		},
		onLoad(){
			uni.login({
				provider: 'weixin',
				success: (loginRes) => {
					this.weixinInfo.code = loginRes.code;
				}
			})
		}
	}
</script>

<style scoped lang="scss">
	.logo-view {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-bottom: 68rpx;
		justify-content: center;
		height: 30vh;
		.logo {
			width: 281rpx;
			height: 277rpx;
			margin-left: auto;
			margin-right: auto;
			margin-top: 100px;
			
		}
	}
	.weixinlogin_content{
		margin-top: 100rpx;
	}
</style>
